<div class="row clearfix">
    <div class="col-md-7 column">
        <table width="100%">
            <tr>
                <td align="left">
                    <button class="btn btn-info" ng-click="createStock()">Add Stock</button>
                </td>
                <td align="right">
                    <tm-pagination conf="paginationConf"></tm-pagination>
                </td>
            </tr>
        </table>
        <div id="warningMsgForStock"></div>
        <table id="stocktable" class="table table-hover table-striped dataTable" role="grid">
        	<thead>
				<tr role="row">
					<th style="white-space:nowrap;">Edit</th>
					<th style="white-space:nowrap;">Stock Code</th>
					<th style="white-space:nowrap;">Stock Name</th>
					<th style="white-space:nowrap;">Status</th>
                    <th style="white-space:nowrap;">Yester Price</th>
					<th></th>
				</tr>
			</thead>
            <tbody>
                <tr ng-repeat='stock in stocks' ng-click="selectCurrentStock($index)">
                    <td width="15%">
                        <edit ng-Model="stock" ng-show="showStockEdit && !stock.id" 
                            d-type="stock" show-stock-edit="showStockEdit" master="master"><a>Edit</a></edit>
                        <update ng-Model="stock" ng-show="!showStockEdit && !stock.id" 
                            d-type="stock" show-stock-edit="showStockEdit" master="master"><a>Update</a></update> 
                        <cancel ng-Model="stock" ng-show="!showStockEdit && !stock.id" 
                            d-type="stock" show-stock-edit="showStockEdit" master="master"> | <a>Cancel</a></cancel>
                        <delete ng-Model="stock" delete-func="deleteStockById(stock.id)"
                        	ng-show="stock.id"><a>Delete</a></delete>
                    </td>
                    <td width="20%">
                        <input type="text" ng-model="stock.code" editable-stockcode
                            id='stock_code_{{stock.code}}' class="inactive" readOnly maxlength="6" size="6"/>
                    </td>
                    <td width="20%">{{stock.name}}</td>
                    <td width="20%">{{stock.statusName}}</td>
                    <td width="20%">{{stock.yesterPrice}}</td>
                    <td width="5%"><span class="glyphicon glyphicon-ok" ng-show="selectedIndex==$index"></span></td>
                </tr>
            </tbody>
        </table>
        <table width="100%">
            <tr>
                <td align="left">
                    <button class="btn btn-info" ng-click="createStock()">Add Stock</button>
                </td>
                <td align="right">
                    <tm-pagination conf="paginationConf"></tm-pagination>
                </td>
            </tr>
        </table>
    </div>
    <div class="col-md-5 column" ng-show="selectedStock.id">
        <div class="page-header" style="margin:0px;">
            <h1>
                {{selectedStock.abbr}} <small>  {{selectedStock.code}}</small>
                <input type="hidden" id="selectedStockId" name="selectedStockId" value={{selectedStock.id}}>
            </h1>
        </div>
        <div id="categoryTagMsg"></div>
        <div class="es-cat-tag-div" style="margin:15px 0px;">
            <span class="es-category-tag" ng-repeat='stockCategory in categoriesByStock'>
                <span ng-show="stockCategory.id" ng-class=tagClasses[$index%6]>
					<label style="font-size:12px;">{{stockCategory.name}}</label>
					<button class="btn estag_btn"><i class="fa fa-times"></i></button>
				</span>
				<span ng-show="!stockCategory.id">
					<input type="text" class="estag_input" size="12" ng-model="stockCategory.name" ng-blur="saveStockCategory()">
					<button class="btn estag_btn"><i class="fa fa-times"></i></button>
				</span>
				&nbsp;&nbsp;
                <input type="hidden" id="selectedStockCategoryId" name="selectedStockCategoryId" value={{stockCategory.id}}>
            </span>
            <button type="button" class="btn btn-default btn-sm" ng-click="createStockCategory()">
                <span class="glyphicon glyphicon-plus"></span>
            </button>
        </div>
        <div id="categoryTagMsg"></div>
        <hr>
        <dl class="dl-horizontal">
            <dt>
                Description lists
            </dt>
            <dd>
                可以添加删除分类，点击分类会查询所有属于该分类的股票
            </dd>
            <dt>
                Euismod
            </dt>
            <dd>
                Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
            </dd>
            <dd>
                Donec id elit non mi porta gravida at eget metus.
            </dd>
            <dt>
                Malesuada porta
            </dt>
            <dd>
                Etiam porta sem malesuada magna mollis euismod.
            </dd>
            <dt>
                Felis euismod semper eget lacinia
            </dt>
            <dd>
                Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
            </dd>
        </dl>
    </div>
</div>

<script>
  $(function () {
	$('.es-cat-tag-div').on('click', '.estag_btn', function () {
		$(this).parent().css('display','none');
		// delete
		var selectedStockCategoryId = $(this).parent().parent().find('#selectedStockCategoryId').val();
		var selectedStockId = $('#selectedStockId').val();
		$.get(
			"deleteStockCatRelate.es", 
			{
			 stockCategoryId:selectedStockCategoryId, 
			 stockId:selectedStockId
			},
			function(data) //回传函数
			{
			    //
		    }
	    );
	});
  });
</script>
